<template></template>

<script setup>
import { useMessage } from 'naive-ui';

const NMessage = useMessage();

let loadingMessage = null;

class Message {
    removeMessage() {
        if (loadingMessage) {
            loadingMessage.destroy();
            loadingMessage = null;
        }
    }

    showMessage(type, content, option = {}) {
        if (loadingMessage) {
            loadingMessage.destroy();
            loadingMessage = null;
        }
        loadingMessage = NMessage[type](content, { ...option, duration: option.duration !== undefined ? option.duration : 1500 });
    }

    loading(content) {
        this.showMessage('loading', content, { duration: 0 });
    }

    success(content, callback = () => { }) {
        this.showMessage('success', content, {
            onLeave: () => {
                callback();
            }
        });
    }

    error(content, callback = () => { }) {
        this.showMessage('error', content, {
            onLeave: () => {
                callback();
            }
        });
    }

    info(content, callback) {
        this.showMessage('info', content, {
            onAfterLeave: () => {
                callback && callback();
            }
        });
    }

    warning(content, callback) {
        this.showMessage('warning', content, {
            onAfterLeave: () => {
                callback && callback();
            }
        });
    }
}

window['$uiMsg'] = new Message();
</script>